<template>
  <!--金卡提交订单页面-->
<div>
  <wv-panel >
    <wv-media-box :thumb="src" title="德人金卡" description="1500.00元" ></wv-media-box>
  </wv-panel>
  <div class="divider"></div>
  <wv-group >
    <wv-cell title="数量" value="1"/>
    <wv-cell title="总计" value="1500.00元" class="total"/>
  </wv-group>
  <div class="divider"></div>
  <offer @confirm="offer"></offer>
</div>
</template>

<script type="text/ecmascript-6">
  import { Dialog } from 'we-vue'
  import offer from '../../offertemplate/offertemplate'
    export default {
        name: 'dingdan',
        props: {},
        data() {
            return {
              src:require('../../../assets/smalljinka.png'),
            };
        },
        methods: {
          offer(payType){
              if(payType=='线下支付'){
                this.$router.push({
                  path: '/downloadoffer'
                })
              }else {
                Dialog.confirm({
                  title: '是否取消支付？',
                  message: '',
                  confirmButtonText:'继续支付',
                  cancelButtonText:'取消支付'
                }).then(() => {
//             处理支付逻辑
                  this.$root.message('confirmed')

                }).catch(() => {
                  this.$router.push({
                    path: '/jinkadetail'
                  })
                })
              }

          }

        },
        created() {

        },
        components: {
            offer
        }
    }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
  .divider{
    height: 10px;
    background-color: #eee;
  }
</style>
